<!-- 语言功能 --> 
<template>
    <el-dropdown>
        <el-button class="iconfont icon-fanyi" />
        <template #dropdown>
            <el-dropdown-menu>
                <el-dropdown-item @click="changelanguage('zh'); $i18n.locale = 'zh';">中文</el-dropdown-item>
                <el-dropdown-item
                    @click="changelanguage('en'); $i18n.locale = 'en';">English</el-dropdown-item>
            </el-dropdown-menu>
        </template>
    </el-dropdown>
    
</template>

<script setup lang="ts">
import { ElMessage } from 'element-plus';

const emit = defineEmits<{ (e: 'changeLanguage', language: string): void }>();
// 刷新不影响翻译效果
/**
 * language存储到本地并给出恰当的提示
 * @param language 语言
 */
const changelanguage = (language: string) => {
    localStorage.setItem("language", language)
    emit("changeLanguage", language)
    if (language=='zh') {
        // 中文提示
        ElMessage.success('已为你切换中文！')
    } else {
        // 英文提示
        ElMessage.success('English has been switched for you！')
    }
}

</script>

<style scoped>
.el-button{
    padding: 0;
}
</style>